<template>
  <div class="container" id="walletInfo">
    <div class="head-top">
      <span>我的</span>
    </div>
    <div class="header">
      <div class="block" @click="$router.push({name:'MyWallet'})">
        <img src="static/img/my_wallet.png" />
        <span>管理钱包</span>
      </div>
      <div class="line"></div>
      <div class="block" @click="$router.push({name:'TransactionHistory'})">
        <img src="static/img/trading.png" />
        <span>交易记录</span>
      </div>
    </div>

    <div class="box">
      <div class="box-block" @click="$router.push({name:'MyMessage'})">
        <div class="b-left">
          <img src="static/img/my1a.png" />
          <span>消息中心</span>
        </div>
        <div>
          <mt-badge
            type="error"
            size="small"
            style="position: relative"
            v-if="messageCount>0"
          >{{messageCount}}</mt-badge>
        </div>
         <img class="b-right" src="static/img/b-right.png" alt="">
      </div>

      <div class="box-block"  @click="$router.push({name:'MyContact'})">
        <div class="b-left">
          <img src="static/img/my2a.png" />
           <span>联系人</span>
        </div>
        <img class="b-right" src="static/img/b-right.png" alt="">
      </div>
      <div class="box-block" @click="$router.push({name:'Invite',params:{index:4}})">
        <div class="b-left">
          <img src="static/img/invite.png" />
          <span>我的邀请码</span>
        </div>
         <img class="b-right" src="static/img/b-right.png" alt="">
      </div>
      <div class="box-block"  @click="$router.push({name:'UserAgreement',params:{index:4}})">
        <div class="b-left">
          <img src="static/img/my3a.png" />
          <span>用户协议</span>
        </div>
        <img class="b-right" src="static/img/b-right.png" alt="">
      </div>
      <!--<div @click="aboutPopul=true">-->
      <!--<div ><img src="static/img/about.png"></div>-->
      <!--<div>关于我</div>-->
      <!--<div>&nbsp;&nbsp;></div>-->
      <!--</div>-->
      <div class="box-block"  @click="$router.push({name:'AboutUs',params:{index:4}})">
        <div class="b-left">
          <img src="static/img/my4a.png" />
          <span>关于我们</span>
        </div>
         <img class="b-right" src="static/img/b-right.png" alt="">
      </div>
      <!--<div>-->
      <!--<div><img src="static/img/setting.png"></div>-->
      <!--<div>系统设置</div>-->
      <!--<div>&nbsp;&nbsp;></div>-->
      <!--</div>-->
    </div>

    <!--<div class="box2">-->
    <!--<div @click="chanNode">-->
    <!--<div><img src="static/img/net.png"></div>-->
    <!--<div>节点设置</div>-->
    <!--<div>&nbsp;&nbsp;></div>-->
    <!--</div>-->
    <!--<div @click="showMsg('暂时不需要个人账号,不影响钱包使用')">-->
    <!--<div><img src="static/img/my.png"></div>-->
    <!--<div>个人中心</div>-->
    <!--<div>&nbsp;&nbsp;></div>-->
    <!--</div>-->
    <!--</div>-->

    <mt-popup
      id="enterPopul"
      v-model="popupVisible"
      popup-transition="popup-fade"
      style="width: 65%;border-radius: .5rem;padding:  3%"
    >
      <h3 style="margin:0rem;padding: 0rem 0rem; text-align: center;">切换节点</h3>

      <div style="padding: .5rem 0rem .5rem 0rem;text-align: center;margin-top: 1rem">ETH节点</div>
      <van-radio-group v-model="ethRadio">
        <van-cell-group>
          <van-cell
            v-for="(ethNode,index) in ethNodeList"
            :key="index"
            :title="ethNode.title"
            clickable
          >
            <van-radio :name="index" />
          </van-cell>
          <!--<van-cell title="优先 1500 sat / kb" clickable @click="radio = '2'">-->
          <!--<van-radio name="2" />-->
          <!--</van-cell>-->
        </van-cell-group>
      </van-radio-group>
    </mt-popup>

    <mt-popup
      id="aboutPopul"
      v-model="aboutPopul"
      popup-transition="popup-fade"
      style="width: 70%;border-radius: .5rem;padding: 3% 5% 5% 5%"
    >
      <h3 style="margin:0rem 0rem 0.5rem 0rem;padding: 0rem 0rem; text-align: center;">about me</h3>

      <div style="width: 100%;height:40%">
        <img src="static/img/me.jpg" style="width: 100%;height:100%;" />
      </div>
    </mt-popup>

    <foot :index="index?index:4"></foot>
  </div>
</template>

<script>
import { mapGetters, mapActions } from "vuex";
import Foot from "../eth/Foot";

import { Popup, Button, Badge } from "mint-ui";
import { Toast } from "vant";

export default {
  components: {
    Foot,
    Popup,
  },
  data() {
    return {
      active: "tab1",
      index: this.$route.params.index ? this.$route.params.index : 4,
      messageCount: 0,
      popupVisible: false,
      aboutPopul: false,
      ethRadio: "",
      ethNodeList: [
        {
          type: "MCOIN",
          title: "https://MCOIN.com",
          // title:'https://yangxuan.net.cn'
        },
      ],
      // ethNodeList:[{
      //   type:'主网络',
      //   title:'https://mainnet.infura.io'
      // },
      //   {
      //     type:'测试网络',
      //     title:'https://rinkeby.infura.io'
      //   }],
      sdcreated: 0,
      created: 0,
    };
  },
  created() {
    this.ethRadio = 0;
    for (let i = 0; i < this.messageList.length; i++) {
      if (this.messageList[i].isRead == false) {
        this.messageCount++;
      }
    }
  },
  computed: {
    ...mapGetters([
      "wallet",
      "accountIndex",
      "coinsList",
      "currentAccount",
      "messageList",
      "ethBaseNet",
      "infuraAK",
    ]),
  },
  methods: {
    ...mapActions([
      "setWallet",
      "setAccountIndex",
      "setCoinByIndex",
      "setEthBalance",
      "setEthPrice",
      "setBalance",
      "setWalletAccountByIndex",
      "setCoinsList",
      "setEthBaseNet",
      "setInfuraAK",
    ]),

    showMsg(msg) {
      Toast.loading({
        duration: 1000, // 持续展示 toast
        forbidClick: true,
        message: msg,
      });
    },
    chanNode() {
      this.popupVisible = true;
    },
  },
  async mounted() {
    let _this = this;
    // this.setCoinsList(require('../../service/eth/config').mainCoinList)
    // this.global.ethBaseNet=require('../../service/eth/config').ethMainNet
    // this.global.infuraAK=require('../../service/eth/config').ethMainAK

    // if(_this.currentAccount) {
    //   accountUtils.initProviderFromPrivateKey(_this.currentAccount.priKey, _this.global.infuraAK).then((provide) => {
    //     accountUtils.initWeb3FromProvider(provide).then(({web3, provider, priKey, pubKey, address}) => {
    //       _this.global.setWeb3(web3)
    //     })
    //   })
    // }
  },
  watch: {
    messageList(newValue, oldValue) {
      let i = 0;
      for (let i = 0; i < this.messageList.length; i++) {
        if (this.messageList[i].isRead == false) {
          i++;
        }
      }
      this.messageCount = i;
    },
  },
};
</script>
<style lang="less" scoped>
@import url("../../assets/css/my.less");
</style>

